<template>
	<view>
		<view class="kiss-list">
			<view class="kcInfo">
				<image v-if="dataForm.pointPicture" class="kcInfo-img" :src="dataForm.pointPicture" mode=""></image>
				<view class="kcInfo-con">
					<view class="name">
						{{dataForm.pointName}}
					</view>
					<view class="name2">
						{{dataForm.unitName}}
					</view>
				</view>
			</view>
		</view>
		<view class="kiss-upDown-list">
			<view class="bx-list-title">
				<view class="left">
					风险点位置
				</view>
			</view>
			<view class="textInput">{{dataForm.location}}</view>
		</view>
		<view class="kiss-upDown-list">
			<view class="bx-list-title">
				<view class="left">
					危险因素描述
				</view>
			</view>
			<view class="textInput">{{dataForm.riskFactor}}</view>
		</view>

		<u-gap height="6" bgColor="#f2f2f2"></u-gap>
		<view class="kiss-upDown-list">
			<view class="bx-list-title">
				<view class="left">
					事故类型
				</view>
			</view>
			<view class="textInput">{{formatType(dataForm.identifyAccidentList)}}</view>
		</view>
		<view class="kiss-upDown-list" v-for="item,index in dataForm.identifyAccidentList"
			:key="index">
			<view class="bx-list-title">
				<view class="left">
					{{`${item.accidentTypeName}应急处置措施`}}
				</view>
			</view>
			<view class="textInput">{{item.measures}}</view>
		</view>

		<u-gap height="6" bgColor="#f2f2f2"></u-gap>
		<view class="kiss-list">
			<view class="kiss-list-title">
				<view class="left">
					风险等级
				</view>
				<view class="right1">
					<view :class="['select-bg']">
						{{dataForm.riskLevel == 1?'重大风险':dataForm.riskLevel == 2?'较大风险':dataForm.riskLevel == 3?'一般风险':'低风险'}}
					</view>
				</view>
			</view>
		</view>
		<view class="kiss-list">
			<view class="kiss-list-title" style="align-items: flex-start;">
				<view class="left">
					风险评价方法
				</view>
				<view class="right1" style="text-align: right;">
					<view :class="['select-bg']">
						{{dataForm.evaluateWay == 1?'直接判定法': dataForm.evaluateWay == 2?'作业条件危险性评价分析法(LEC)':'风险矩阵法（LS）'}}
					</view>
				</view>
			</view>
		</view>
		<view class="kiss-list" v-if="dataForm.evaluateWay == 2 || dataForm.evaluateWay == 3">
			<view class="kiss-list-title">
				<view class="left">
					发生可能性(L)
				</view>
				<view class="right1">
					<view :class="['select-bg']">
						{{dataForm.possibility}}
					</view>
				</view>
			</view>
		</view>
		<view class="kiss-list" v-if="dataForm.evaluateWay == 2">
			<view class="kiss-list-title">
				<view class="left">
					暴露频繁程度(E)
				</view>
				<view class="right1">
					<view :class="['select-bg']">
						{{dataForm.frequentDegree}}
					</view>
				</view>
			</view>
		</view>
		<view class="kiss-list" v-if="dataForm.evaluateWay == 2">
			<view class="kiss-list-title">
				<view class="left">
					损失后果(C)
				</view>
				<view class="right1">
					<view :class="['select-bg']">
						{{dataForm.lossResultant}}
					</view>
				</view>
			</view>
		</view>
		<view class="kiss-list" v-if="dataForm.evaluateWay == 3">
			<view class="kiss-list-title">
				<view class="left">
					严重程度(S)
				</view>
				<view class="right1">
					<view :class="['select-bg']">
						{{dataForm.seriousDegree}}
					</view>
				</view>
			</view>
		</view>


		<view class="kiss-title">
			<view class="left">
				安全标志
			</view>
		</view>
		<view class="kiss-upload">
			<view class="textInput" v-if="imgList.length == 0">暂无安全标志</view>
			<view class="imgBox" v-else-if="imgList.length > 0">
				<view class="img" v-for="v in imgList">
					<image @tap="previewImage(v,imgList)" :src="v"></image>
				</view>
			</view>
		</view>
		<u-gap height="6" bgColor="#f2f2f2"></u-gap>
		<view class="kiss-list">
			<view class="kiss-list-title">
				<view class="left">
					提交人
				</view>
				<view class="right1">
					<view :class="['select-bg']">
						{{dataForm.userName}}
					</view>
				</view>
			</view>
		</view>
		<view class="kiss-list">
			<view class="kiss-list-title">
				<view class="left">
					提交时间
				</view>
				<view class="right1">
					<view :class="['select-bg']">
						{{dataForm.createTime}}
					</view>
				</view>
			</view>
		</view>
		<view class="bottom-subside" style='height: 22px;'></view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				imgList: [],
				dataForm: {}
			}
		},
		onLoad(options) {
			this.id = options.id
			this.initData()
		},
		methods: {
			initData() {
				uni.$u.http.get(`/check/mobile/riskIdentifyRecord/getInfo/${this.id}`).then(res => {
					if (res.code == 0) {
						this.dataForm = res.data
						if (res.data.symbolPictures) {
							this.imgList = res.data.symbolPictures.split(',')
						}
					}
				}).catch(err => {
					uni.$u.toast(err)
				})
			},
			formatType(arr) {
				let newArr = []
				arr.map(item => {
					newArr.push(item.accidentTypeName)
				})
				return newArr.join(',')
			},
			//预览图片
			previewImage: function(e, s) {
				let imgList = []
				if (s.pictures) {
					imgList = this.getpictureList(s.pictures)
				} else {
					imgList = s
				}
				uni.previewImage({
					current: e,
					urls: imgList,
				});
			},
			//处理图片
			getpictureList(pictureinfo) {
				if (pictureinfo) {
					var splitAdd = pictureinfo.split(",");
					var imgList = []
					for (let i = 0; i < splitAdd.length; i++) {
						let iOrV = splitAdd[i].split("?")[0].split(".")
						let iOrVL = splitAdd[i].split("?")[0].split(".").length - 1
						if (iOrV[iOrVL] != 'mp4') {
							imgList.push(splitAdd[i])
						}
					}
					return imgList
				} else {
					return []
				}
			},
		}
	}
</script>

<style lang="scss" scoped>
	.imgBox {
		display: flex;
		flex-wrap: wrap;


		.img {
			width: 28vw;
			height: 28vw;
			margin-bottom: 4vw;
			margin-right: 4vw;

			image {
				width: 100%;
				height: 100%;
			}
		}

		.img:nth-child(3n) {
			margin-right: 0;
		}


	}

	.kcInfo {
		padding: 32rpx;
		display: flex;
		border-bottom: 1px solid #f5f5f5;

		.kcInfo-img {
			min-width: 160rpx;
			width: 160rpx;
			height: 160rpx;
			margin-right: 32rpx;
		}

		.kcInfo-con {
			flex: 1;
			display: flex;
			flex-direction: column;
			justify-content: space-between;

			.name {
				font-size: 32rpx;
				font-weight: 400;
				color: #333333;
				overflow: hidden;
				text-overflow: ellipsis;
				display: -webkit-box;
				-webkit-line-clamp: 2;
				-webkit-box-orient: vertical;
				word-wrap: break-word;
				word-break: break-all;
				margin-bottom: 16rpx;
			}

			.name2 {
				font-size: 28rpx;
				font-weight: 400;
				color: #8C8C8C;
				overflow: hidden;
				text-overflow: ellipsis;
				display: -webkit-box;
				-webkit-line-clamp: 2;
				-webkit-box-orient: vertical;
				word-wrap: break-word;
				word-break: break-all;
			}
		}
	}
</style>
